<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<script src="../js/mui.min.js"></script>
	<script type="text/javascript" src="../js/webjs.min.js"></script>
	<link href="../css/mui.min.css" rel="stylesheet" />

	<body>
		<header class="mui-bar mui-bar-nav">
			<h1 class="mui-title">登录</h1>
		</header>
		<div class="mui-content">
			<form id='login-form' class="mui-input-group">
				<div class="mui-input-row">
					<label>账号</label>
					<input id='account' type="text" class="mui-input-clear mui-input" placeholder="请输入账号">
				</div>
				<div class="mui-input-row">
					<label>密码</label>
					<input id='password' type="password" class="mui-input-clear mui-input" placeholder="请输入密码">
				</div>
			</form>
			<form class="mui-input-group">
				<ul class="mui-table-view mui-table-view-chevron">
					<li class="mui-table-view-cell">
						自动登录
						<div id="autoLogin" class="mui-switch">
							<div class="mui-switch-handle"></div>
						</div>
					</li>
				</ul>
			</form>
			<div class="mui-content-padded">
				<button id='login' class="mui-btn mui-btn-block mui-btn-primary">登录</button>
				<div class="link-area"><a id='reg'>注册账号</a> <span class="spliter">|</span> <a id='forgetPassword'>忘记密码</a>
				</div>
			</div>
			<div class="mui-content-padded oauth-area">

			</div>
		</div>
	</body>
	<script>
		/* 闭包形式创建js部分 */
		(function($, document) {
			$.init();
			$.plusReady(function() {
				//这一块编写该界面所有的方法，事件的调用
				var loginButton = document.getElementById("login");
				loginButton.addEventListener("tap", function(event) {
					var request = {
						username: 'admin',
						password: '123456'
					};
					//登陆的点击事件
					$webjs.webRequest("userService", "login", request, true, function(data) {
						console.log("访问成功后返回的值："+JSON.stringify(data));
						plus.nativeUI.toast("访问成功",{
							icon:"../img/user-photo.png",
							duration:"long",
							align:"center",
							verticalAlign:"center"
						});						
					}, function(error) {
						console.log("访问失败后返回的值："+error);
						plus.nativeUI.toast(error,{
							icon:"../img/user-photo.png",
							duration:"long",
							align:"center",
							verticalAlign:"center"
						});
					});
				});
			});
		})(mui, document);
	</script>

</html>